import React, { Component } from 'react';
import { inject, observer } from 'mobx-react';
import {
  WeaLocaleProvider, WeaRightMenu, WeaDialog, WeaFormItem, WeaSearchGroup,
} from 'ecCom';
import { WeaSwitch } from 'comsMobx';
import * as dialogTypes from '../../../constants/OdocCompsDialogType';
import SignInput from '../public/SignInput';
import { Button } from 'antd';
import '../public/signInputLog.less';
import { toJS } from 'mobx';


const { getLabel } = WeaLocaleProvider;
/**
 * 给流程追加意见
 * 加操作者，或者减少操作者，或者修改状态
 */
@inject('appendSignLogStore', 'odocCompsStore')
@observer
class Append extends Component {
  constructor(props) {
    super(props);
    this.state = {
      height: 520,
    };
  }

  componentWillReceiveProps(nextProps) {
    if (this.props.visible != nextProps.visible && nextProps.visible) {
      this.loadData();
    }
  }

  componentWillMount() {
    this.loadData();
  }

  loadData = () => {
    const { appendSignLogStore, odocCompsStore = {} } = this.props;
    const { doInit } = appendSignLogStore;
    let params = {},
      visible = false;
    try {
      let { requestParam, dialogVisible } = odocCompsStore;
      visible = dialogVisible.get(dialogTypes.ODOC_APPEND_SIGNLOG);
      params = toJS(requestParam);
      delete params.markInfo;
    } catch (e) {
      params.requestid = '11014012';// 开发热部署测试
      visible = true;
    }
    if (visible) {
      doInit(params, this.onCancel);
    }
  }

  render() {
    const { appendSignLogStore, odocCompsStore = {} } = this.props;
    let visible = false;
    try {
      const { dialogVisible } = odocCompsStore;
      visible = dialogVisible.get(dialogTypes.ODOC_APPEND_SIGNLOG);
    } catch (e) {
      visible = true;// 开发热部署测试
    }

    const { height } = this.state;
    const { coreparams = {} } = appendSignLogStore;
    const { title = getLabel(520456, '代录意见') } = coreparams;
    let dialogparams = {
      style: { width: 800, height },
      visible,
      title,
      icon: 'icon-coms-Need-feedback',
      onCancel: this.onCancel,
      buttons: this.getButtons(),
      layout: jQuery('.wf-req')[0],
    };
    return (
      <div>
        <WeaDialog ecId={`${this && this.props && this.props.ecId || ''}_WeaDialog@o81b2f`} {...dialogparams} className={'signInputDialog'}>
          <WeaRightMenu ecId={`${this && this.props && this.props.ecId || ''}_WeaRightMenu@diyswp`} datas={this.getRightMenu()}>
            <div className={'content'}>
              {this.getFormContent()}
              {this.getSignInputContent()}
            </div>
          </WeaRightMenu>
        </WeaDialog>
      </div>
    );
  }

  getFormContent = () => {
    const { appendSignLogStore } = this.props;
    const { condition = [], form } = appendSignLogStore;
    let groups = [];
    if (form.isFormInit) {
      condition.length > 0 && condition.map((group, index) => {
        groups.push(<WeaSearchGroup ecId={`${this && this.props && this.props.ecId || ''}_WeaSearchGroup@4esa60@${index}`}
          needTigger={true}
          title={group.title}
          showGroup={group.defaultshow}
          items={group.items.map(field => ({
            com: (
              <WeaFormItem ecId={`${this && this.props && this.props.ecId || ''}_WeaFormItem@f9jplu@${field.domkey[0]}`}
                label={field.label}
                labelCol={{ span: field.labelcol }}
                wrapperCol={{ span: field.fieldcol }}
                error={form.getError(field)}
              >
                <WeaSwitch ecId={`${this && this.props && this.props.ecId || ''}_WeaSwitch@8g1xgd@${field.domkey[0]}`}
                  fieldConfig={field}
                  onChange={data => this.onChange(data, field.otherParams)}
                  form={form}
                />
              </WeaFormItem>
            ),
            col: 1,
          }))}
        />);
      });
    }
    return (<div className={'formContetn'}>
      {groups}
    </div>);
  }

	/**
	 * change
	 * @param data
	 * @param otherParams
	 */
  onChange = (data, otherParams = {}) => {
    const { appendSignLogStore } = this.props;
    const { controlOptions = false } = appendSignLogStore;
    if (controlOptions && data && data.appendToUseId) {
      const { otherUserAppend = false } = otherParams;
      if (otherUserAppend) {
        if (data.appendToUseId.value) {
          const { getSqlWhere } = appendSignLogStore;
          getSqlWhere({ appendToUseId: data.appendToUseId.value, data });
        }
      }
    }
  }

	/**
	 * 签字意见
	 * @returns {*}
	 */
  getSignInputContent = () => {
    const { odocCompsStore = {} } = this.props;
    const { appendSignLogStore } = this.props;
    let { refid, sumitParams, signinput, showSignInput = false } = appendSignLogStore;
    const { signInputRequired } = sumitParams;
    const { workflowStores = {} } = odocCompsStore;
    signinput = toJS(signinput);

    return (<div className={'signInput'}>
      {showSignInput && <SignInput ecId={`${this && this.props && this.props.ecId || ''}_SignInput@7p06ll`}
        coreparams={{ title: getLabel(514420, '代录'), refid, signInputRequired, premarkinfo: signinput }}
        workflowStores={workflowStores}
        allFunction={{ changecallback: this.changeSignInput }}
      />}
    </div>);
  }

  changeSignInput = (v) => {
    const { appendSignLogStore } = this.props;
    const { changeSubmitParams } = appendSignLogStore;
    changeSubmitParams(v);
  }

	/**
	 * 取消
	 */
  onCancel = (res = {}) => {
    const { appendSignLogStore, onClose } = this.props;
    const { destory } = appendSignLogStore;
    typeof onClose == 'function' && (onClose(res));
    typeof destory == 'function' && (destory());
  }

	/**
	 * 获取右键菜单
	 * @returns {Array}
	 */
  getRightMenu() {
    let btns = [];
    const { appendSignLogStore } = this.props;
    const { loading = false } = appendSignLogStore;
    const showAllBtns = this.allBtns();
    showAllBtns && showAllBtns.map((item) => {
      if (item.key != 'close') {
        if (!loading) {
          item.disabled = 'true';
        }
        btns.push({ ...item });
      } else {
        btns.push({ ...item });
      }
    });
    return btns;
  }

	/**
	 * dialog获取底部按钮
	 * @returns {Array}
	 */
  getButtons = () => {
    let buttons = [];
    const { appendSignLogStore } = this.props;
    const { loading = false } = appendSignLogStore;
    const showAllBtns = this.allBtns();
    showAllBtns && showAllBtns.map((item, index) => {
      if (item.key != 'close') {
        if (!loading) {
          item.disabled = 'true';
        }
        buttons.push([<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@cjrov8@${index}`} {...item}>{item.content}</Button>]);
      } else {
        buttons.push([<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@0d2095@${index}`} {...item}>{item.content}</Button>]);
      }
      // buttons.push([<Button {...item}>{item.content}</Button>])
    });
    return buttons;
  }

	/**
	 * 统一管理btns
	 * @returns {{key: string, icon: *, content: *, onClick: Index.goSave, type: string}[]}
	 */
  allBtns = () => {
    const { appendSignLogStore, pluginbuttons = [], odocCompsStore = {} } = this.props;
    const { workflowStores = {} } = odocCompsStore;

    const { doSave } = appendSignLogStore;
    let showAllBtns = [
      {
        key: 'save',
        icon: <i className="icon-coms-Preservation" />,
        content: getLabel(520456, '代录意见'),
        onClick: () => doSave(workflowStores, this.onCancel),
        type: 'primary',
      },
      {
        key: 'close',
        icon: <i className="icon-coms-go-back" />,
        content: getLabel(201, '取消'),
        onClick: this.onCancel,
        type: 'ghost',
      },
    ];
    pluginbuttons && pluginbuttons.length >= 1 && (showAllBtns = showAllBtns.concat(pluginbuttons));
    return showAllBtns;
  }
}
export default Append;
